<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <style>
    .left div,
    .right div {
        width: 100%;
        height: 50px;
        padding: 5px;
        margin: 5px;
        float: left;
        border: 1px solid #ccc;
    }

    .left div {
        background: #bbffaa;
    }

.right div {
    background: yellow;
}
</style>
 <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
  </head>
  <body>
    <h4>测试一</h4>
        <div class="left">
            on('mousedown mouseup')
            <div class="aaron">点击触发</div>
        </div>
        <button>点击删除mousedown事件</button>
        <script type="text/javascript">
        var n = 1;
        //绑定事件
        $('.aaron:first').on('mousedown mouseup',function(e){
          $(this).text('触发类型' +  (e.type) + ',次数' + n)
          n++;
        })
        //删除事件
        $('button:first').click(function(){
          $('.aaron:first').off('mousedown')
        })
        </script>

        <h4>测试一</h4>
        <div class="left">
            on('mousedown mouseup')
            <div class="aaron">点击触发</div>
        </div>
        <button>点击销毁所有事件off</button>
        <script type="text/javascript">
        var n  = 0;
        //绑定事件
        $(".aaron:last").on('mousedown mouseup', function(e) {
            $(this).text( '触发类型:' +  (e.type) + ",次数" + n)
            ++n;
        })

        //删除事件
        $("button:last").click(function() {
            $(".aaron:last").off()
        })

        </script>
  </body>
</html>
